<script setup lang="ts">
import Channel from './components/Channel.vue'
import NewsList from './components/NewsList.vue'
import axios from 'axios'

type TResponse<T> = { data: T, message: string }
type TChannelItem = { id: number; name: string }

// 需求：获取频道列表存储到 list 数组
const getList = async () => {
  // !axios.get 的第一个的泛型参数可以控制 r.data 的类型
  // const r = await axios.get<{ data: { channels: { id: number; name: string }[] }, message: string }>('http://geek.itheima.net/v1_0/channels')
  const r = await axios.get<TResponse<{ channels: TChannelItem[] }>>('http://geek.itheima.net/v1_0/channels')
  console.log(r.data.data.channels[0].id)
  // console.log(r.data.data.channels)
}
getList()
</script>

<template>
  <Channel />
  <NewsList />
</template>